<template>
    <div>
        <Navigator></Navigator>
        <Header></Header>
        <div id="body">
            <div class="title">
                Add Tag
            </div>

            <div class="basic_inf">
                <div class="name">
                    <el-input type="text" placeholder="tag name" v-model="name"></el-input>
                </div>
                <div class="created_by">
                    <el-input type="text" placeholder="author name" v-model="createdBy"></el-input>
                </div>
            </div>

            <div class="submit">
                <el-button @click="submit">submit</el-button>
            </div>
        </div>
    </div>
</template>

<script>
    import Navigator from "@/components/Navigator";
    import Header from "@/components/Header";
    export default {
        name: "AddTag",
        components: {Header, Navigator},
        data(){
            return{
                tag: null,
                name: null,
                createdBy: null
            }
        },
        methods:{
            submit:function () {
                this.axios.get('/tag/add',{params:{
                        "name": this.name,
                        "created_by": this.created_by,
                        "time": new Date().getFullYear(),
                        "token": sessionStorage.getItem("token")
                    }})
                    .then(res=>{
                    res = res.data
                    if (res.code === 200){
                        this.$message({
                            message: 'add successfully',
                            type: 'success'
                        })
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        })
                    }
                })

                window.location.href = "./tag"
            }
        }
    }
</script>

<style scoped lang="scss">
    #body {
        width: 50%;
        box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);

        margin: 100px auto;

        display: flex;
        flex-direction: column;

        .title {
            font-size: 32px;
            font-weight: 500;
            margin: 20px auto;
        }

        .basic_inf {
            .name {
                width: 50% !important;
                margin: 20px auto;
            }

            .created_by {
                width: 50% !important;
                margin: 0 auto;
            }
        }

        .submit{
            margin: 20px auto;
        }
    }
</style>
